import React from 'react'
import {
    View,
    Text,
    StyleSheet,
    TouchableWithoutFeedback,
    Image,
    Dimensions
} from 'react-native'

import {
    WebView
} from 'react-native-webview'

import YYLabelComponent from '../component/YYLabelComponent'
import { getContentHeight } from '../../utils'

export default class CommunityContentCell extends React.PureComponent {

    constructor(props) {
        super(props)
        this.width = Dimensions.get('window').width - styles.container.marginLeft - styles.container.marginRight;
        this.frameStr = '{{'+styles.container.marginLeft+','+styles.container.marginTop+'},{'+this.width+','+0+'}}'
        this.contentFontSize = 15
        this.gifFontSize = 20
        if (this.props.height == null) {
            getContentHeight(this.props.data.content, this.contentFontSize, this.gifFontSize, this.width, (error, height) => {
                let key = this.width + this.props.data.content
                this.props.cacheHeight && this.props.cacheHeight(key, height)
                this.setState({
                    height:height
                })
            })
        }
    }

    componentWillUnmount = () => {
        this.setState = (state,callback)=>{
          return;
        };
    }

    state = {
        height: this.props.height,
    }

    render() {
        return (
            <TouchableWithoutFeedback onPress={this.clickCellAction}>
                <View style={styles.container}>
                    <YYLabelComponent 
                        style={[styles.content, {height:this.state.height}]}
                        content={this.props.data.content}
                        numberOfLines={0}
                        preferredMaxLayoutWidth={this.width}
                        frameStr={this.frameStr}
                        contentFontSize={this.contentFontSize}
                        gifFontSize={this.gifFontSize}
                    />
                </View>
            </TouchableWithoutFeedback>
        )
    }

    clickCellAction = () => {
        this.props.clickCellAction(this.props.data)
    }

    richText() {
        return this.props.data.needRichText == '1' ? <Text style={styles.richText}>全文</Text> : null
    }
}
const injectedJs = 'setInterval(() => {window.parent.postMessage(document.getElementById("content").client)})'
const styles = StyleSheet.create({
    container: {
        justifyContent: 'center',
        marginLeft: 10,
        marginTop: 5,
        marginBottom: 5,
        marginRight: 10,
    },
    content: {
        fontSize: 15,
        color: "#666666",
    },
    richText: {
        fontSize: 15,
        color: 'rgba(51, 178, 246, 1)'
    }
})